<span ng-click="group.expanded = !group.expanded">
    {{ group.name | translate }}
  <i
    class="iconfont"
    ng-class="{'icon-down_3': !group.expanded, 'icon-up_3': group.expanded}"
  ></i>
  
</span>

<!-- Child groups -->
<ul
  ng-repeat="group in group.groups"
  class="stencil-group stencil-group-non-root"
  ng-class="{collapsed: !group.expanded, 'first': $first}"
  ng-include="'editor-app/partials/stencil-item-template.html?version=5'"
></ul>

<!-- Group items -->
<ul>
  <li
    ng-repeat="item in group.paletteItems"
    class="stencil-item"
    id="{{ item.id }}"
    title="{{ item.description | translate }}"
    ng-model="draggedElement"
    data-drag="true"
    jqyoui-draggable="{onStart:'startDragCallback', onDrag:'dragCallback'}"
    data-jqyoui-options="{revert: 'invalid', helper: 'clone', opacity : 0.5}"
  >
    <img
      ng-if="!item.customIcon"
      ng-src="editor-app/stencilsets/{{ getStencilSetName() }}/icons/{{ item.icon }}"
      width="16px;"
      height="16px;"
    />
    <img ng-if="item.customIcon" ng-src="{{ getImageUrl(item.icon) }}" width="16px;" height="16px;" />
    {{ item.name | translate }}
  </li>
</ul>
